<template>
     <div>
                <el-breadcrumb separator=">">
                    <el-breadcrumb-item :to="{ path: '/' }">全部模板</el-breadcrumb-item>
                    <!-- <el-breadcrumb-item >{{  }}</el-breadcrumb-item> -->
                    <el-breadcrumb-item class="com_box" v-for="(item, index) in crumbs" :key="index">
                        <div class="com_list">
                            <div> {{ item }}</div>
                            <div class="del" @click="onDelText(item)">×</div>
                        </div>
                    </el-breadcrumb-item>
                    <el-breadcrumb-item>约 <span class="span">{{ chilg }}</span> 个搜索结果</el-breadcrumb-item>
                </el-breadcrumb>
            </div>
</template>

<script setup lang="ts">
import {inject} from 'vue'; 
let {crumbs,chilg}:any=defineProps(['crumbs','chilg']);
// console.log(crumbs,datalength,'==============>len');
const onDelText= inject('onDelText',(a:any)=>{});
</script>

<style scoped lang="scss">
   .com_box {
        position: relative;
        bottom: 3px;
    }
    .com_list {
        background: hsl(210, 36%, 96%);
        display: flex;
        padding: 2px 3px;
        border-radius: 3px;
        cursor: pointer;
        padding: 4px;

        .del {
            margin-left: 6px;
        }
    }
    .span {
    color: rgb(54, 54, 255);
    font-weight: 500;
    font-style: 12px;
}

</style>